<%@ page import="java.util.Date" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%--
  Created by IntelliJ IDEA.
  User: silence
  Date: 17-6-1
  Time: 下午8:29
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>主页</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Bootstrap core CSS -->
    <link href="<c:url value="/resources/lib/bootstrap/css/bootstrap.min.css"/>" rel="stylesheet">
</head>
<body>
<div class="container">

    <h1 class="h1 ">主页</h1>
    <div class="row">
        <a class="col-md-1 btn btn-warning" href="<c:url value="/bill"/>">记一笔</a>

        <span class="col-md-2"></span>

        <form action="<c:url value="/home/1"/>" method="get" class="col-md-6 form-group">
            <label class="label-inverse" for="createDate">按时间查看: </label>
            <input class="input-append" type="date" name="createDate" id="createDate" value="${createDate}">
            <button class="btn btn-primary">查看</button>
        </form>

        <span class="col-md-2"></span>

        <a class="col-md-1 btn btn-primary" href="<c:url value="/home/1"/>">查看所有</a>
    </div>




    <h2 class="text-success text-center"><fmt:formatDate value="${createDate}"/></h2>

    <table class="table">

        <tr class="table-bordered text-info text-center">
            <td>No.</td>
            <td>标题</td>
            <td>金额</td>
            <td>收入/支出</td>
            <td>描述</td>
            <td>日期</td>
            <td>操作</td>
        </tr>

        <c:if test="${pager.totalRecord == 0}">
            <h3 class="text-warning text-center">暂无账单</h3>
        </c:if>

        <%--总收支--%>
        <c:set var="totalPay" value="0"/>
        <c:set var="totalCome" value="0"/>

        <c:forEach items="${pager.data}" var="bill" varStatus="status">
            <c:if test="${bill.type.id == 1}">
                <c:set var="totalPay" value="${totalPay + bill.money}"/>
            </c:if>
            <c:if test="${bill.type.id == 2}">
                <c:set var="totalCome" value="${totalCome + bill.money}"/>
            </c:if>
            <%--<c:set var="totalPay" value="${totalPay + bill.money}"/>--%>
            <tr class="table-bordered text-center" id="bill_" + ${bill.id}>
                <td>${bill.id}</td>
                <td>${bill.title}</td>
                <td>${bill.money}</td>
                <td>${bill.type.name}</td>
                <td>${bill.introduce}</td>
                <td><fmt:formatDate value="${bill.createDate}"/></td>
                <td>
                    <a href="/bill_edit/${bill.id}">修改</a>
                    <a onclick="deleteBill(${bill.id}, this.parentNode.parentNode)">删除</a>
                </td>
            </tr>
        </c:forEach>
        <tr><td></td></tr>
        <tr class="text-center">
            <td colspan="3">总支出：￥${totalPay}</td>
        </tr>
        <tr class="text-center">
            <td colspan="3">总收入：￥${totalCome}</td>
        </tr>
    </table>

    <%-- 页标 --%>
    <c:if test="${pager.totalPage != 1 && pager.totalPage != 0}">
        <div class="text-center">
                <%-- 首页 --%>
            <c:if test="${pager.pageIndex != 1}">
                <a class="btn btn-info" href="<c:url value="/home/1"/>">首页</a>
            </c:if>

                <%--中间页--%>
            <c:forEach begin="1" end="${pager.totalPage}" varStatus="status">

                <%-- 当前页 --%>
                <c:if test="${pager.pageIndex == status.index}">
                    <span class="btn btn-default">${status.index}</span>
                </c:if>

                <%--非当前页--%>
                <c:if test="${pager.pageIndex != status.index}">
                    <a class="btn btn-info" href="<c:url value="/home/${status.index}"/> ">${status.index}</a>
                </c:if>
            </c:forEach>

                <%-- 末页 --%>
            <c:if test="${pager.totalPage != pager.pageIndex}">
                <a class="btn btn-info" href="<c:url value="/home/${pager.totalPage}"/> ">末页</a>
            </c:if>
        </div>
    </c:if>

</div>
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="<c:url value="/resources/lib/jquery/jquery.min.js"/>"></script>

<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="<c:url value="/resources/lib/bootstrap/js/bootstrap.min.js"/>"></script>

<script>

    /** 删除一条 */
    function deleteBill(id, dem) {
        if (window.confirm("确认删除吗？")) {
            $.ajax({
                url: '/bill/delete/' + id,
                type: 'post',
                success: function (res) {
                    dem.parentNode.removeChild(dem);
                },
                error: function (res) {
                    alert("request error!")
                }
            });
        }

    }
</script>
</body>
</html>
